<template>
    <div class="pay-error-wrapper">
        <el-dialog
            :visible.sync="centerDialogVisible"
            center>
            <div class="icon-wrapper">
                <span class="icon-unfinished"></span>
            </div>
            <p class="text">该订单未完成支付！</p>
            <span slot="footer" class="dialog-footer el-pay-error">
                <el-button @click="centerDialogVisible = false">关&nbsp;&nbsp;&nbsp;&nbsp;闭</el-button>
            </span>
        </el-dialog>
    </div>
</template>
<script>
      export default {
    data() {
      return {
        centerDialogVisible: true
      };
    }
  };
</script>
<style scoped lang="stylus" rel="stylesheet/stylus">
@import "~style/base.styl"
@import "~style/modify.styl"
    .icon-wrapper{
        height 54px
        padding-top 30px
        text-align center
        font-size 54px
        line-height 54px
    }

    .text{
        @extend .clear-default
        height 20px
        margin-top 36px
        margin-bottom 44px
        line-height 20px
        text-align center
        font-size $font-size-large-l
        color $color-sub-theme
        text-align center
    }
    .el-dialog__footer
        &:after{
            content ''
            display block
            clear both
        }

</style>


